package myJs.cps

import com.softwaremill.quicklens._
import japgolly.scalajs.react.ReactMonocle._
import japgolly.scalajs.react._
import japgolly.scalajs.react.component.Scala.BackendScope
import japgolly.scalajs.react.extra.StateSnapshot
import japgolly.scalajs.react.vdom.all._
import monocle.Lens
import monocle.macros.Lenses
import myJs.components.inline.{InputInlineComponent, SelectInlineComponent}
import myJs.myPkg.Hooks.useState
import myJs.myPkg.jquery._
import myJs.tool.Tool._

import scala.collection.immutable.SeqMap

/** Created by yz on 3/11/2020
  */
object FontArgCp {

  case class Props(
      showRowNameShow: Boolean = false,
      yFontShow: Boolean = false,
      yRotateShow: Boolean = false,
      showColNameShow: Boolean = false,
      xFontShow: Boolean = false,
      xRotateShow: Boolean = false,
      claalphaShow: Boolean = false,
      clapewShow: Boolean = false,
      clascwShow: Boolean = false,
      clapcwShow: Boolean = false,
      mainTitleShow: Boolean = false,
      mainTitleFontShow: Boolean = false,
      xTitleFontShow: Boolean = false,
      yTitleFontShow: Boolean = false,
      feacfsShow: Boolean = false,
      legendTitleShow: Boolean = false,
      legendTitleFontShow: Boolean = false,
      legendFontShow: Boolean = false,
      sampleFontShow: Boolean = false,
      envFontShow: Boolean = false,
      speciesFontShow: Boolean = false,
      clalfsShow: Boolean = false,
      claclfsShow: Boolean = false
  ) {
    @inline def render: VdomElement = {
      Component(this)
    }
  }

  case class State(
      claalpha: String = "0.2",
      clapew: String = "0.25",
      clascw: String = "2",
      clapcw: String = "0.75",
      mainTitle: String = "",
      mainTitleFont: String = "15",
      showColName: String = "T",
      xTitleFont: String = "12",
      xFont: String = "10",
      xRotate: String = "0",
      showRowName: String = "T",
      yTitleFont: String = "T",
      yFont: String = "6",
      yRotate: String = "-90",
      legendTitle: String = "finalDecision",
      legendTitleFont: String = "11",
      legendFont: String = "9",
      sampleFont: String = "7",
      envFont: String = "7",
      speciesFont: String = "7",
      clalfs: String = "6",
      claclfs: String = "8",
      feacfs: String = "13"
  )

  val Component = ScalaFnComponent[Props] { props =>
    type BasicDataType = State
    val (basicData, setBasicData) = useState(State())

    object FTool {

      def strChange(f: PathLazyModify[State, String]) = (v: String) => {
        setBasicData {
          f.setTo(v)
        }
      }

    }

    val showRowNameMap = SeqMap("F" -> messages("no"), "T" -> messages("yes"))
    val yFontShow = if (props.showRowNameShow) {
      basicData.showRowName == "T"
    } else props.yFontShow
    val yRotateShow = if (props.showRowNameShow) {
      basicData.showRowName == "T"
    } else props.yRotateShow
    val xFontShow = if (props.showColNameShow) {
      basicData.showColName == "T"
    } else props.xFontShow
    val xRotateShow = if (props.showColNameShow) {
      basicData.showColName == "T"
    } else props.xRotateShow
    val yRotateMap = SeqMap("90" -> "-90", "45" -> "-45", "0" -> "0", "-45" -> "45", "-90" -> "90")
    div(
      InputInlineCp
        .Props(
          value = basicData.claalpha,
          label = messages("claalpha"),
          name = "claalpha",
          show = props.claalphaShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.claalpha))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.clapew,
          label = messages("clapew"),
          name = "clapew",
          show = props.clapewShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.clapew))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.clascw,
          label = messages("clascw"),
          name = "clascw",
          show = props.clascwShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.clascw))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.clapcw,
          label = messages("clapcw"),
          name = "clapcw",
          show = props.clapcwShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.clapcw))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.mainTitle,
          label = messages("mainTitleContent"),
          name = "mainTitle",
          show = props.mainTitleShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.mainTitle))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.mainTitleFont,
          label = messages("mainTitleSize"),
          name = "mainTitleFont",
          show = props.mainTitleFontShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.mainTitleFont))
        )
        .render,
      SelectInlineCp
        .Props(
          value = basicData.showColName,
          label = messages("showColnames"),
          name = "showColName",
          show = props.showColNameShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.showColName)),
          optionMap = showRowNameMap
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.xTitleFont,
          label = messages("xaxisTitleSize"),
          name = "xTitleFont",
          show = props.xTitleFontShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.xTitleFont))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.xFont,
          label = messages("xaxisTextSize"),
          name = "xFont",
          show = xFontShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.xFont))
        )
        .render,
      SelectInlineCp
        .Props(
          value = basicData.xRotate,
          label = messages("colnamesAngle"),
          name = "xRotate",
          show = xRotateShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.xRotate)),
          optionMap = yRotateMap
        )
        .render,
      SelectInlineCp
        .Props(
          value = basicData.showRowName,
          label = messages("showRownames"),
          name = "showRowName",
          show = props.showRowNameShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.showRowName)),
          optionMap = showRowNameMap
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.yTitleFont,
          label = messages("yAxisTitleSize"),
          name = "yTitleFont",
          show = props.yTitleFontShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.yTitleFont))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.feacfs,
          label = messages("feacfs"),
          name = "feacfs",
          show = props.feacfsShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.feacfs))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.yFont,
          label = messages("yAxisTextSize"),
          name = "yFont",
          show = props.yFontShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.yFont))
        )
        .render,
      SelectInlineCp
        .Props(
          value = basicData.yRotate,
          label = messages("yRotate"),
          name = "yRotate",
          show = yRotateShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.yRotate)),
          optionMap = yRotateMap
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.legendTitle,
          label = messages("legendTitleContent"),
          name = "legendTitle",
          show = props.legendTitleShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.legendTitle))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.legendTitleFont,
          label = messages("legendTitleSize"),
          name = "legendTitleFont",
          show = props.legendTitleFontShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.legendTitleFont))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.legendFont,
          label = messages("legendTextSize"),
          name = "legendFont",
          show = props.legendFontShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.legendFont))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.sampleFont,
          label = messages("sampleNameFontSize"),
          name = "sampleFont",
          show = props.sampleFontShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.sampleFont))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.envFont,
          label = messages("environmentalFactorsFontSize"),
          name = "envFont",
          show = props.envFontShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.envFont))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.speciesFont,
          label = messages("speciesFontSize"),
          name = "speciesFont",
          show = props.speciesFontShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.speciesFont))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.clalfs,
          label = messages("clalfs"),
          name = "clalfs",
          show = props.clalfsShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.clalfs))
        )
        .render,
      InputInlineCp
        .Props(
          value = basicData.claclfs,
          label = messages("claclfs"),
          name = "claclfs",
          show = props.claclfsShow,
          onChange = FTool.strChange(modifyLens[BasicDataType](_.claclfs))
        )
        .render
    )

  }

}
